<!DOCTYPE html>
<html>
<head>
    <title>微食刻自助收银</title>
    <!--#include("common/common-link.html"){}-->

    <link rel="stylesheet" href="https://yanlight-trade.oss-cn-zhangjiakou.aliyuncs.com/css/animate.min.css">
    <script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer"></script>

</head>
<body>

<div align="right" class="active-mask" style="display: none">
    <img onclick="common_mask_click()" src="https://yanlight-trade.oss-cn-zhangjiakou.aliyuncs.com/images/bg/icon_red_packet.png"
         class="right-top bounce animated infinite">
</div>

<div class="wrap" style="display: none">

    <div class="panel">


        <div align="center">
            <img src="${logo}" class="img-rounded round_icon">
        </div>

        <div>
            <strong class="shop-name">${name}</strong>
        </div>

        <!--<div align="left">-->
        <!--<span class="pay-desc">支付金额</span>-->
        <!--</div>-->

        <div align="left" class="input-container">
            <div class="input-wrap">
                <input type="number" class="form-control money-input " autofocus :value="fee" v-model="fee"
                       placeholder="请输入金额">
            </div>
            <div align="center" class="logo-wrap">
                <span class="money-logo">¥</span>
            </div>
        </div>

        <div align="left" class="mark-desc-container">
            <span class="mark-desc" @click="inputDesc">填写备注</span>
        </div>

        <div class="btn-container">
            <a href="javascript:;" class="btn pay-btn" @click="submit">立即支付</a>
        </div>
    </div>


    <div class="ad-notice" style="display: none">
        <span class="ad-text-style">看广告，抽大奖~</span>
    </div>

    <iframe id="actives"
            frameborder="no"
            marginwidth="0"
            marginheight="0"
            scrolling="no"
            allowtransparency="yes"
            class="custom-iframe"
            style="display: none">
    </iframe>

</div>


<script type="text/javascript">

    var hostname = get_common_host_name()
    var iframeHost = hostname + "active/applyMoney?companyId=" + '${companyId}';

    document.getElementById("actives").src = iframeHost


    var vue = {};
    var pageData = {};
    var form = {};

    vue.initialize = function () {
        pageData.fee = "";
        pageData.totalFee = 0;
        form.payType = 2;
        form.remark = "";
        new Vue({
            el: ".wrap",
            data: pageData,
            methods: vue
        });
        Vue.nextTick(function () {
            $(".wrap").show();
        });

        common_init_pay(2, '${userAuthId}', '${companyId}', '${codeValue}')

        if ('${adType}' == 1) {
            $(".custom-iframe").show();
        } else {
            $(".ad-notice").show()
            common_init_ad(true)

            var isShow = '${isShowRedPacket}' == 'true'
            if (isShow) {
                $(".active-mask").show();
            }
        }


        // common_init_active(isShow)

    };

    vue.inputDesc = function () {
        var value = prompt("请输入备注", form.remark)
        if (value != null && value != "") {
            form.remark = value;
        }
    }

    vue.submit = function () {

        if (vue.checkFee()) {
            common_show_loading()
            var url = ctx + "/order/place/${paycode}";
            form.totalFee = pageData.totalFee;
            form.sceneType = '${sceneType}';
            <!--#if(isNotEmpty(operationId)){-->
            form.operationId = '${operationId}';
            <!--#}-->

            $.ajax({
                url: url,
                type: 'POST',
                data: form,
                contentType: "application/x-www-form-urlencoded;charset=UTF-8",
                dataType: "json",
                success: function (result) {
                    common_dismiss_loading();
                    var status = result.status;
                    var code = result.code;
                    var errorMsg = result.errorMsg;
                    if (status == 'success') {
                        pay(result.data);
                        return;
                    } else {
                        toast(errorMsg);
                    }
                },
                error: function () {
                    common_dismiss_loading();
                    common_toast("系统错误，请稍后重试！");
                }
            });
        }
    };
    vue.checkFee = function () {
        if (!window.WeixinJSBridge) {
            // toast("不支持该支付");
            alert("不支持该支付")
            return;
        }
        var userFee = pageData.fee;
        if (!(/^[0-9]+.?[0-9]*$/.test(userFee))) {
            alert("请输入有效的金额!")
            // toast("请输入有效的金额！");
            $(".fee").focus();
            return false;
        }
        pageData.totalFee = userFee;
        return true;
    };

    function pay(data) {
        WeixinJSBridge.invoke('getBrandWCPayRequest', {
                appId: data.appId,
                timeStamp: data.timeStamp,
                nonceStr: data.nonceStr,
                package: data.packageStr,
                signType: data.signType,
                paySign: data.paySign
            },
            function (res) {
                if (res.err_msg == "get_brand_wcpay_request:ok") {
                    common_mask_click()
                    // window.location.href = get_common_host_name() + '/ad/wheelView';
                    // WeixinJSBridge.invoke('closeWindow');
                } else {
                    alert("未完成的交易，请稍后重试");
                }
            });
    };

    vue.initialize();

</script>
</body>
</html>